﻿.article {
  width: 300px;
  height: 250px;
  transition: opacity 200ms ease-out;
  transition-delay: 50ms;
  background-color: #CCC;
  color: white;
}
.article > .win-template {
  opacity: 0;
}
.article.loaded > .win-template {
  opacity: 1;
}
.article:first-child {
  width: 610px;
  height: 510px;
}
.article:nth-child(4n),
.article:nth-child(3n+1) {
  width: 300px;
  height: 510px;
}
.article:nth-child(6n),
.article:nth-child(4n+3) {
  width: 610px;
  height: 250px;
}
.article .win-template {
  width: 100%;
  height: 100%;
  position: relative;
}
.article .win-template .bgimage {
  position: absolute;
  width: 100%;
  height: 100%;
  background-size: cover;
}
.article .win-template .content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px;
  font-size: 14pt;
  background-color: rgba(0, 0, 0, 0.95);
}
/*.phone .article {
    width: 100px;
    height: 50px;



    transition: opacity 200ms ease-out;
    transition-delay: 50ms;

    &:first-child {
        width: 410px;
        height: 310px;
    }

    &:nth-child(4n), &:nth-child(3n+1) {
        width: 200px;
        height: 310px;
    }

    &:nth-child(6n), &:nth-child(4n+3) {
        width: 410px;
        height: 50px;
    }

}*/
/*# sourceMappingURL=items.css.map */